import {
  DrawerForm,
  ProFormText,
  ProFormDigit,
  ProFormTextArea,
  ProFormSwitch,
  ProFormDateTimePicker
} from '@ant-design/pro-form';
import {message, Button, Form} from 'antd';
import React from 'react';
import {ProFormSelect} from "@ant-design/pro-components";
import {LessonOption} from "@/constants/LessonConstants";
import {listVehicleAPI, pageVehicleAPI} from "@/pages/vehicle/vehicle-manager/service";
import {listLicenseTypeAPI} from "@/pages/license-type/services";
import {listCourseSubjectAPI} from "@/pages/course-subject/services";

interface CourseFormProps {
  trigger?: React.ReactNode;
  onSubmit: (values: API.ILesson) => Promise<boolean>;
  initialValues?: API.ILesson;
  title?: string;
  onOpenChange?: (open: boolean) => void;
}

const LessonEditForm: React.FC<CourseFormProps> = ({
                                                     trigger = <Button type="primary">发布课程</Button>,
                                                     onSubmit,
                                                     initialValues,
                                                     title = '课程表单',
                                                     onOpenChange,
                                                   }) => {
  const [form] = Form.useForm();

  return (
    <DrawerForm<API.ILesson>
      title={title}
      width={800}
      trigger={trigger as any}
      form={form}
      onOpenChange={(open) => {
        if (!open) {
          form.resetFields();
        }
        onOpenChange?.(open);
      }}
      grid
      rowProps={{
        gutter: 16,
      }}
      onFinish={async (values) => {
        return onSubmit(values);
      }}
      initialValues={initialValues}
    >
      <ProFormSelect
        name="licenseTypeId"
        label="报名类型"
        request={async () => {
          const {data} = await listLicenseTypeAPI({});
          return (data || []).map((item: API.ILicenseType) => {
            return {
              label: `${item.licenseCode}-${item.licenseName}`,
              value: item.id,
            }
          })
        }}
        options={LessonOption}
        colProps={{span: 12}}
        rules={[{required: true, message: '请选择报名类型'}]}
      />
      <ProFormSelect
        name="courseTypeId"
        label="科目"
        request={async () => {
          const {data} = await listCourseSubjectAPI({});
          return (data || []).map((item: API.ICourseSubject) => {
            return {
              label: item.subjectName,
              value: item.id,
            }
          })
        }}
        options={LessonOption}
        colProps={{span: 12}}
        rules={[{required: true, message: '请选择科目'}]}
      />
      <ProFormSelect
        name="plateNumber"
        label="车牌号"
        showSearch={true}
        debounceTime={300}
        colProps={{span: 12}}
        rules={[{required: true, message: '请选择车牌号'}]}
        placeholder="请输入车辆ID"
        request={async (value) => {
          const {data} = await pageVehicleAPI({
            pageNum: 1,
            pageSize: 100,
            plateNumber: value.keyWords,
            status: '1'
          });
          return data.data.map((item: API.IVehicle) => ({
            label: item.plateNumber,
            value: item.plateNumber,
          }));
        }}
      />
      <ProFormDateTimePicker
        name="startTime"
        label="开始时间"
        rules={[{required: true, message: '请选择开始时间'}]}
        fieldProps={{
          style: {width: '100%'},
          format: 'YYYY-MM-DD HH:mm:ss',
          showTime: {format: 'HH:mm'},
        }}
        colProps={{span: 12}}
      />
      <ProFormDateTimePicker
        name="endTime"
        label="结束时间"
        rules={[{required: true, message: '请选择结束时间'}]}
        fieldProps={{
          style: {width: '100%'},
          format: 'YYYY-MM-DD HH:mm:ss',
          showTime: {format: 'HH:mm'},
        }}
        colProps={{span: 12}}
      />
      <ProFormSelect
        name="status"
        label="预约状态"
        rules={[{required: true, message: '请选择预约状态'}]}
        options={[
          {label: '可预约', value: '1'},
          {label: '预约上限', value: '2'},
          {label: '禁止预约', value: '3'},
        ]}
        colProps={{span: 12}}
      />
      <ProFormDigit
        name="maxStudents"
        label="最大学员数量"
        min={1}
        max={50}
        colProps={{span: 12}}
        rules={[{required: true, message: '请输入最大学员数量'}]}
      />
      <ProFormText
        name="password"
        label="签到口令"
        colProps={{span: 12}}
        rules={[{required: true, message: '请输入签到口令'}]}
      />
      <ProFormTextArea
        name="remark"
        label="备注"
        placeholder="请输入备注信息"
      />
    </DrawerForm>
  );
};

export default LessonEditForm;
